<template>
  <div class="dx-big-screen">
    <iframe
      id="iframe"
      frameborder="0"
      src="http://123.56.133.253/#/"
      style="width: 100vw; height: 100vh"
    ></iframe>
    <div class="aa-aa">
      <div title="返回" @click="handleBackpage()">
        <i class="el-icon-s-home" />
      </div>
    </div>
  </div>
</template>
<script>
export default {
  methods: {
    handleBackpage() {
      this.$router.push("/project");
    },
  },
};
</script>

<style  lang="scss" scoped>
.dx-big-screen {
  width: 100vw;
  height: 100vh;
  background-color: salmon;
  position: relative;
}
.aa-aa {
  position: fixed;
  right: 10px;
  bottom: 10px;
  & > div {
    width: 32px;
    height: 32px;
    margin-bottom: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    background-color: #3f4854;
    color: #e6e6e6;
    fill: #e6e6e6;
    box-shadow: 0 1px 4px rgb(0 0 0 / 30%);
    line-height: 32px;
    border-radius: 6px;
    font-size: 20px;
    cursor: pointer;
    border-radius: 14%;
    padding: 0;
    vertical-align: middle;
    border: 1px solid #444;
    & > i {
      transform: scale(1);
      transition: all 0.6s;
    }
  }
  & > div:last-child {
    margin-bottom: 0px;
  }
  & > div:hover {
    color: #fff;
    fill: #fff;
    background: #48b;
    border-color: #aef;
    box-shadow: 0 0 8px #fff;
    i {
      transform: scale(1.4);
    }
  }
}
</style>